<template>
    <div class="card" @click="handleClick">
        <div class="title">标题</div>
        <div class="divider"></div>
        <div class="content">内容</div>
        <el-row justify="space-between" class="footer">
            <span>编辑人</span>
            <span class="date">2021-9-22 16:37</span>
        </el-row>
    </div>
</template>

<script>
    import { defineComponent } from 'vue'

    export default defineComponent({
        props: {
            id: {
                type: String,
                default: '',
            },
        },
        setup() {
            function handleClick() {}

            return {
                handleClick,
            }
        },
    })
</script>

<style scoped lang="less">
    @import url('@/common.less');
    .card {
        .title {
            font-size: 25px;
        }
        .divider {
            height: 1px;
            background: #dcdfe6;
            margin: 10px 0px;
        }
        .content {
            font-size: 18px;
            color: @grey-font;
        }
        .footer {
            margin-top: 10px;
            font-size: 10px;
            color: @light-grey-font;
            .date {
            }
        }
    }
</style>
3
